<template>
    <div class="org-container">
        <el-row :gutter="20">
            <el-col :span="10">
                <el-form :model="orgForm" ref="orgFormRef" :hide-required-asterisk="true" label-width="80px" size="small">
                    <el-form-item label="组织名称" prop="orgName" :rules="$validate.validates({required:true,msg:'组织名称不能为空'})">
                        <el-input v-model="orgForm.orgName" placeholder="输入组织名称" maxlength="10"></el-input>
                    </el-form-item>

                    <el-form-item label="组织编号" prop="orgName" v-if="$store.getters.type== 1" :rules="$validate.validates({required:true,msg:'组织编号不能为空'})">
                        <el-input v-model="orgForm.orgNo" placeholder="输入组织编号" maxlength="10"></el-input>
                    </el-form-item>

                    <el-form-item label="上级组织" prop="parentId" v-if="$store.getters.type == 2" :rules="$validate.validates({required:true,msg:'上级组织不能为空'})">
                        <ed-tree v-model="orgForm.parentId" apiUrl="/system/org/list" :treeForm="treeForm" @onclick="onclick"></ed-tree>
                    </el-form-item>

                    <el-form-item>
                        <el-button type="primary" @click="onSubmit('orgFormRef')" :loading="disabled">创建组织
                        </el-button>
                        <el-button @click="$utilsSet.goBack($router)">取消</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
    </div>
</template>

<script>
    import {postOrgAdd} from "src/api/permission";
    import EdTree from "../../../components/EdTree.vue";
    export default {
        name: "OrgCreate",
        components:{
            EdTree
        },
        data(){
            return{
                orgForm:{
                    orgName:"",
                    parentId:"",
                    orgNo:""
                },
                disabled:false,
                treeForm:{
                    placeholder:"请选择上级组织"
                }
            }
        },
        mounted(){
            console.log("getters",this.$store.getters.type)
        },
        methods:{
            onSubmit(formName) {
                this.$refs[formName].validate((valid) => {

                    if (valid) {
                        this.disabled = true;
                        window.setTimeout(() => {
                            this.disabled = false
                        }, 2000);

                        let params = {};
                        params.orgName = this.orgForm.orgName;
                        if(this.$store.getters.type == 2){
                            params.parentId = this.orgForm.parentId;
                            params.type = 1;
                        }else {
                            params.orgNo = this.orgForm.orgNo;
                            params.type = 0;
                        }
                        postOrgAdd(params).then(response => {
                            if(response.code == 20000) {
                                this.$message.success({
                                    message: '已成功添加组织 即将返回组织列表',
                                    duration: 2000,
                                    center:true
                                });

                                window.setTimeout(() => {
                                    this.$utilsSet.goBack(this.$router);
                                }, 600)
                            }
                        })
                    }
                })
            },
            onclick(node){
                this.orgForm.parentId = node.orgId
            }
        }
    }
</script>

<style lang="scss" scoped>
    .org {
        &-container {
            margin: 30px;

            .control {
                &-area {
                    margin-bottom: 8px;
                }
            }

            /*.pagination {*/
            /*    margin-top: 12px;*/
            /*    display: flex;*/
            /*    justify-content: center;*/
            /*}*/
        }
    }
</style>